<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<link rel="preconnect" href="https://fonts.gstatic.com">
	<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC&family=Poppins&display=swap" rel="stylesheet">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css"
		integrity="sha512-+4zCK9k+qNFUR5X+cKL9EIR+ZOhtIloNl9GIKS57V1MyNsYpYcUrUeQc9vNfzsWfV28IaLL3i96P9sdNyeRssA=="
		crossorigin="anonymous" />
	<link rel="stylesheet" href="style.css" />
	<title>To Do List</title>
</head>

<body>
	<header>
		<h1>My Todo List</h1>
	</header>
	<form>
		<input class="todo-input" type="text" />
		<button class="todo-button" type="submit">
			<!-- <i class="fas fa-trash"></i> -->
			<i class="fas fa-plus"></i>
		</button>
		<div class="select">
			<select name="todos" id="filter-todo">
				<option value="all">全部</option>
				<option value="completed">已完成</option>
				<option value="uncompleted">正在进行</option>
			</select>
		</div>
	</form>
	<div class="todo-container">
		<ul class="todo-list">
			<div class="todo">
				<li class="todo-item">写完代码再睡觉</li>
				<button class="complete-btn">
					<i class="fas fa-check"></i>
				</button>
				<button class="trash-btn">
					<i class="fas fa-trash"></i>
				</button>
			</div>
		</ul>
	</div>
	<script src="main.js"></script>
</body>

</html>